<template>
        <div class="home" v-loading="state.loading">
            <div v-if="state.isRole" class="roleCenter">
				
			</div>
			<div v-else class="notRole">
				<div class="notRole-center">
					<el-image fit="contain" style="width: 100px; height: 100px;margin:5px;"  :src="themeConfig.logoMini"></el-image>
					<div class="notRole-name">
					  <div class="notRole-cdnm">{{themeConfig.globalTitle}}</div>
					  <div class="notRole-cdnmxt">欢迎使用 <code>TVKM</code> 系统</div>
					</div>
				</div>
			</div>
        </div>
    </template>
    
    <script lang="ts" setup name="home">
    import { toRefs,ref, reactive,onMounted, defineComponent } from 'vue';
    import { useRouter } from 'vue-router'
    import { ElNotification, ElMessage ,ElMessageBox ,FormRules,ElTree} from 'element-plus'
    import * as echarts from 'echarts';
    
	import { storeToRefs } from 'pinia';
	import { useThemeConfig } from '/@/stores/themeConfig';
	// 定义变量内容
	const storesThemeConfig = useThemeConfig();
	const { themeConfig } = storeToRefs(storesThemeConfig);


    const router = useRouter();
    
    const state = reactive({
        roleBtn:router.currentRoute.value.meta.roleBtn,
        loading:false,
        btnloading:false,
        dataList:[],
        pages: {
            isAll: false,
            pageCount: 0,
            pageSize: 10,
            recordCount: 0,
            pno: 1
          },
		isRole:false,
    });
    // 权限判断
    const isAuthBtn = (e) => {
        let auth=false;
        if(e){
            for(let p of state.roleBtn){
                if(p==e){
                    auth=true;
                }
            }
        }
        return auth;
    };
    // 跳转
    const tourl = (e) => {
        router.push(e);
    };
    
    onMounted(()=>{
          // 获取当前路由实例参数
        //   console.dir(router.currentRoute.value.query.id);
        //   console.dir(router.currentRoute.value.meta.roleBtn);
          if(!isAuthBtn('index')){
             state.isRole=false;
          }else{
            state.isRole=true;
              //操作函数
			state.loading=false;
          }
    })
    </script>
    
    <style scoped lang="scss">
        .home{
            padding:5px;
            .roleCenter{
                min-height: 85vh;
                background: #ffffff;
            }
			.notRole{
				width: 100%;
				text-align: center;
				margin-top: 10%;
				&-text {
					font-size: 30px;
				}
				&-name{
					text-align: center;
				}
				&-cdnm{
					font-size: 16px;
					color: #333;
				}
				&-cdnmxt{
					margin-top: 5px;
					font-size: 13px;
					color: #999;
				}
			}
        }
    </style>
    